import CSS from './myPl.module.css'
import { useNavigate } from 'react-router-dom'
import { Grid } from 'react-vant'
import { HomeO, Friends, Column, Star, Shop, Bag, Gift,Comment,GoldCoin,BalanceList, Label } from '@react-vant/icons'
export default function MyPL() {
    const navigate = useNavigate()
    //我的订单
    const handleGoToOrderPage=(status)=>{
        navigate(`/myOrder/${status}`)
    }
    //我的商品
    const handlemyRelease=(status)=>{
        navigate(`/myRelease/${status}`)
    }
    const daishen=()=>{
        alert('功能待开发')
    }
    return <>
        <div className={CSS.container}>
            <div className={CSS.top}>
                <div className={CSS.main1} onClick={()=>navigate('/personal')}>
                    <div className={CSS.main1_left}><img src="../public/img/1.png" alt="" width="100%" height="100%" /></div>
                    <div className={CSS.main1_right}>
                        <p className={CSS.p1}><b>赵志勇</b></p>
                    </div>
                </div>
            </div>
            <div className={CSS.top1}>
                <span className={CSS.top1_p}>我是买家</span>
                <Grid columnNum={4} border={false}>
                    <Grid.Item icon={<Shop style={{ color: 'red' }} />} text='待付款' onClick={()=>handleGoToOrderPage('to-pay')} />
                    <Grid.Item icon={<Bag style={{ color: 'red' }} />} text='待发货' onClick={() => handleGoToOrderPage('to-ship')} />
                    <Grid.Item icon={<Gift style={{ color: 'red' }} />} text='待收货' onClick={() => handleGoToOrderPage('to-receive')} />
                    <Grid.Item icon={<Column style={{ color: 'red' }} />} text='全部订单' onClick={() => handleGoToOrderPage('all')} />
                    <Grid.Item icon={<Star style={{ color: 'red' }} />} text='收藏' onClick={()=>navigate('/myCollect')} />
                    <Grid.Item icon={<Friends style={{ color: 'red' }} />} text='历史浏览' onClick={()=>navigate('/browsingHistory')}/>
                </Grid>
            </div>
            <div className={CSS.top2}>
                <span className={CSS.top1_p}>我是卖家</span>
                <Grid columnNum={4} border={false}>
                    <Grid.Item icon={<Label style={{ color: 'red' }} />} text='待审核' onClick={daishen}/>
                    <Grid.Item icon={<BalanceList style={{ color: 'red' }} />} text='出售中' onClick={()=>handlemyRelease('On-Sale')} />
                    <Grid.Item icon={<GoldCoin style={{ color: 'red' }} />} text='已出售' onClick={()=>handlemyRelease('Sold')} />
                    <Grid.Item icon={<Comment style={{ color: 'red' }} />} text='全部商品' onClick={()=>handlemyRelease('pron')} />
                    <Grid.Item icon={<Bag style={{ color: 'red' }} />} text='待发货' onClick={() => handleGoToOrderPage('to-ship')} />
                    <Grid.Item icon={<Gift style={{ color: 'red' }} />} text='待收货' onClick={() => handleGoToOrderPage('to-receive')} />
                    <Grid.Item icon={<Column style={{ color: 'red' }} />} text='交易成功' onClick={() => handleGoToOrderPage('success')} />
                    <Grid.Item icon={<Column style={{ color: 'red' }} />} text='全部订单' onClick={() => handleGoToOrderPage('all')} />
                </Grid>
            </div>
        </div>
    </>
}